<html><head><meta charset="utf-8"/><title>jQuery</title></head><body><h1>jQuery</h1><div class="x-wiki-content x-main-content">
 <p>
  你可能听说过jQuery，它名字起得很土，但却是JavaScript世界中使用最广泛的一个库。
 </p>
 <p>
  江湖传言，全世界大约有80~90%的网站直接或间接地使用了jQuery。鉴于它如此流行，又如此好用，所以每一个入门JavaScript的前端工程师都应该了解和学习它。
 </p>
 <p>
  jQuery这么流行，肯定是因为它解决了一些很重要的问题。实际上，jQuery能帮我们干这些事情：
 </p>
 <ul>
  <li>
   <p>
    消除浏览器差异：你不需要自己写冗长的代码来针对不同的浏览器来绑定事件，编写AJAX等代码；
   </p>
  </li>
  <li>
   <p>
    简洁的操作DOM的方法：写
    <code>
     $('#test')
    </code>
    肯定比
    <code>
     document.getElementById('test')
    </code>
    来得简洁；
   </p>
  </li>
  <li>
   <p>
    轻松实现动画、修改CSS等各种操作。
   </p>
  </li>
 </ul>
 <p>
  jQuery的理念“Write Less, Do More“，让你写更少的代码，完成更多的工作！
 </p>
 <h3>
  jQuery版本
 </h3>
 <p>
  目前jQuery有1.x和2.x两个主要版本，区别在于2.x移除了对古老的IE 6、7、8的支持，因此2.x的代码更精简。选择哪个版本主要取决于你是否想支持IE 6~8。
 </p>
 <p>
  从
  <a href="http://jquery.com/download/">
   jQuery官网
  </a>
  可以下载最新版本。jQuery只是一个
  <code>
   jquery-xxx.js
  </code>
  文件，但你会看到有compressed（已压缩）和uncompressed（未压缩）两种版本，使用时完全一样，但如果你想深入研究jQuery源码，那就用uncompressed版本。
 </p>
 <h3>
  使用jQuery
 </h3>
 <p>
  使用jQuery只需要在页面的
  <code>
   &lt;head&gt;
  </code>
  引入jQuery文件即可：
 </p>
 <pre><code>&lt;html&gt;
&lt;head&gt;
    &lt;script src="//code.jquery.com/jquery-1.11.3.min.js"&gt;&lt;/script&gt;
	...
&lt;/head&gt;
&lt;body&gt;
    ...
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
 <p>
  好消息是，当你在学习这个教程时，由于网站本身已经引用了jQuery，所以你可以直接使用：
 </p>
 <pre><code class="language-x-javascript">'use strict';
----
console.log('jQuery版本：' + $.fn.jquery);
</code></pre>
 <h3>
  $符号
 </h3>
 <p>
  <code>
   $
  </code>
  是著名的jQuery符号。实际上，jQuery把所有功能全部封装在一个全局变量
  <code>
   jQuery
  </code>
  中，而
  <code>
   $
  </code>
  也是一个合法的变量名，它是变量
  <code>
   jQuery
  </code>
  的别名：
 </p>
 <pre><code>window.jQuery; // jQuery(selector, context)
window.$; // jQuery(selector, context)
$ === jQuery; // true
typeof($); // 'function'
</code></pre>
 <p>
  <code>
   $
  </code>
  本质上就是一个函数，但是函数也是对象，于是
  <code>
   $
  </code>
  除了可以直接调用外，也可以有很多其他属性。
 </p>
 <p>
  <em>
   注意
  </em>
  ，你看到的
  <code>
   $
  </code>
  函数名可能不是
  <code>
   jQuery(selector, context)
  </code>
  ，因为很多JavaScript压缩工具可以对函数名和参数改名，所以压缩过的jQuery源码
  <code>
   $
  </code>
  函数可能变成
  <code>
   a(b, c)
  </code>
  。
 </p>
 <p>
  绝大多数时候，我们都直接用
  <code>
   $
  </code>
  （因为写起来更简单嘛）。但是，如果
  <code>
   $
  </code>
  这个变量不幸地被占用了，而且还不能改，那我们就只能让
  <code>
   jQuery
  </code>
  把
  <code>
   $
  </code>
  变量交出来，然后就只能使用
  <code>
   jQuery
  </code>
  这个变量：
 </p>
 <pre><code>$; // jQuery(selector, context)
jQuery.noConflict();
$; // undefined
jQuery; // jQuery(selector, context)
</code></pre>
 <p>
  这种黑魔法的原理是jQuery在占用
  <code>
   $
  </code>
  之前，先在内部保存了原来的
  <code>
   $
  </code>
  ,调用
  <code>
   jQuery.noConflict()
  </code>
  时会把原来保存的变量还原。
 </p>
</div>
</body></html>